<template>
  <div class="editaddr">
    <van-nav-bar
      :title="this.$route.meta.title"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />
    <van-address-edit
      :area-list="areaList"
      :address-info="AddressInfo"
      show-set-default
      show-search-result
      :search-result="searchResult"
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      @delete="onDelete"
    />
  </div>
</template>

<script>
import { areaList } from "@vant/area-data";
import { getAddrApi, updateAddressApi, getAddresslistApi } from "@/api/address";
export default {
  data() {
    return {
      areaList,
      searchResult: [],
      AddressInfo: {},
      areaCode: "",
    };
  },
  methods: {
    // 保存更新的地址信息
    async onSave(AddressInfo) {
      // Toast('save');
      console.log(AddressInfo);
      // 获取更改地址的id
      const id = this.$route.params.id;
      const addrlist = await getAddresslistApi();
      // 判断是否要更改为默认地址
      if (AddressInfo.isDefault == true) {
        console.log(222);
        let defaultaddr = [];
        defaultaddr = addrlist.addresses.filter(
          (addr) => addr.isDefault == true
        );
        console.log(defaultaddr[0]);
        if (defaultaddr.length != 0) {
          if (defaultaddr[0]._id != id) {
            console.log("aaa");
            defaultaddr[0].isDefault = false;
            console.log(5555, defaultaddr[0]);
            await updateAddressApi(defaultaddr[0]._id, defaultaddr[0]);
          }
        }
        // const result2 = await updateAddressApi(id,AddressInfo);
        console.log(id, AddressInfo);
        // 更新地址信息
        await updateAddressApi(id, AddressInfo);
      } else {
        // 如果修改的地址不修改为默认地址，直接更新
        const flag = await updateAddressApi(id, AddressInfo);
        console.log(flag);
      }
      this.$router.push("/addresslist");
    },
    onDelete() {
      // Toast('delete');
    },
    // 获取地址的地区码
    async init() {
      var _ = require("lodash");
      _.forEach(this.areaList.province_list, (o, p) => {
        if (o == this.AddressInfo.province) {
          _.forEach(this.areaList.city_list, (o, c) => {
            if (o == this.AddressInfo.city) {
              if (p.slice(0, 2) == c.slice(0, 2)) {
                _.forEach(this.areaList.county_list, (o, co) => {
                  // console.log(o, c);
                  if (o == this.AddressInfo.county) {
                    if (c.slice(0, 4) == co.slice(0, 4)) {
                      let countryId = co;
                      this.areaCode = countryId;
                    }
                  }
                });
              }
            }
          });
        }
      });
    },
    // 加载更改地址的信息
    async loadAddr() {
      console.log(this.$route.params.id);
      // 获取更改地址的id
      const id = this.$route.params.id;
      const result = await getAddrApi(id);
      console.log(result);
      // 将原本的地址信息渲染到页面
      this.$set(this.AddressInfo, "name", result.receiver);
      this.$set(this.AddressInfo, "tel", result.mobile);
      this.$set(this.AddressInfo, "addressDetail", result.address);
      this.$set(this.AddressInfo, "postalCode", result.tel);
      this.$set(this.AddressInfo, "isDefault", result.isDefault);
      let [province, city, county] = result.regions.split("-");
      console.log(province, city, county);
      this.$set(this.AddressInfo, "province", province);
      this.$set(this.AddressInfo, "city", city);
      this.$set(this.AddressInfo, "county", county);
      this.init();
      this.$set(this.AddressInfo, "areaCode", this.areaCode);
    },
    // 点击返回按钮
    onClickLeft() {
      this.$router.push("/addresslist");
    },
  },
  created() {
    this.loadAddr();
  },
};
</script>

<style>
.editaddr {
  padding-top: 50px;
}
.editaddr .van-button--danger {
  background-color: #000;
  border-color: #000;
}
.editaddr .van-switch--on {
  background-color: #0058a3;
}
.editaddr textarea {
  height: 45px !important;
}
.editaddr .van-cell {
  line-height: 45px;
}
.editaddr .van-nav-bar .van-icon,
.editaddr .van-nav-bar__text {
  color: #000;
}
.editaddr .van-nav-bar {
  position: fixed;
  width: 100%;
  top: 0;
}
</style>
